<!doctype html>
<html>
	<head>
		<title>Radar Chart</title>
                <script src="qrc:/html/Chart.js"></script>
                <script src="qrc:/html/utils.js"></script>
		<style>
			canvas{
			}
		</style>
	</head>
	<body>
                <div style="width:100%">
                        <canvas id="canvas" height="230" width="230"></canvas>
		</div>


	<script>
        var color = Chart.helpers.color;
	var radarChartData = {        
            type: 'radar',
            data: {
                labels : ["Cyclomatic complexity", "Refs", "Basic Blocks", "XRefs", "End BB"],
                datasets : [
                    {
                        label: "Amount",
                        backgroundColor: color(window.chartColors.blue).alpha(0.2).rgbString(),
                        borderColor: window.chartColors.blue,
                        pointBackgroundColor: window.chartColors.blue,
                        data : [MEOW]
                    }
                ]
            },
            options: {
                legend: {
                    display: false,
                },
                title: {
                    display: false,
                    text: 'Binary statistics'
                },
                tooltips: {
                    intersect: false,
                    displayColors: false,
                },
                animation: {
                    duration: 0
                },
                scale: {
                  ticks: {
                    beginAtZero: true
                  }
                }
            }
            };


            window.onload = function(){
                    var ctx = document.getElementById("canvas").getContext("2d");
                    window.myLine = new Chart(ctx, radarChartData);
            }

	</script>
	</body>
</html>
